<div>
<div class="projectPopUp">
    <div class="projectPopUpHead">
        <div class="projectLogo">
            <a href="${project.pageUrl}"><img src="${project.pictureUrl}" width="100px" height="100px"/></a>
        </div>
        <div class="projectSummary">
            <table>
                <thead></thead>
                <tbody>
                    <tr><td><a href="${project.pageUrl}">${project.name}</a></td></tr>
                    <tr><td>${project.place}</td></tr>
                    <tr><td>${project.followers} followers</td></tr>
                </tbody>
            </table>
        </div>
        <div class="projectActions">
            <ul>
                <li><a href="#">Follow</a></li>
                <li><a href="#">Join</a></li>
            </ul>
        </div>
    </div>
    <div class="projectPopUpBody">
        <ul class="projectTabs">
		    <li class="infoTab"><a href="#">Infos</a></li>
		    <li class="feedsTab"><a href="#">Stream</a></li>
	    </ul>
        <div class="projectFeeds">
            {{if loggedUser != null}}
            <div class="shareFeed">
                <div class="picture">
                    <a href="${loggedUser.pageUrl}"><img src="${loggedUser.pictureUrl}" width="50px" height="50px"/></a>
                </div>
                <div class="body">
                    <form action="${project.apiUrl}">
                        <input type="text" placeholder="What's happened in your project recently ?" />
                        <input type="submit" value="Share" />
                    </form>
                </div>
            </div>
            {{/if}}
            <div class="bubbleList">
                {{each(i, feed) project.feeds}}
                {{tmpl({feed: feed, user: feed.user}) "feedEntry"}}
                {{/each}}
            </div>
        </div>
        <div class="projectInfo">
            <div class="baseInfos">
                <table>
                    <thead></thead>
                    <tbody>
                        <tr>
                            <th>Organisations</th>
                            <td>
                                {{each(i, org) project.organisations}}
                                ${org.name} and
                                {{/each}}
                            </td>
                        </tr>
                        <tr>
                            <th>Description</th><td>${project.description}</td>
                        </tr>
                        <tr>
                            <th>Duration</th><td>${project.duration}</td>
                        </tr>
                        <tr>
                            <th>Location</th><td>${project.place}</td>
                        </tr>
                        <tr>
                            <th>Sector</th><td>${project.sector}</td>
                        </tr>
                        <tr>
                            <th>Contact</th><td>${project.contact}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="bubbleList">
                <h2><span>We make it happen !</span></h2>
                {{each(i, member) project.members}}
                {{tmpl({user: member}) "userSummary"}}
                {{/each}}
            </div>
        </div>
    </div> 
</div>
</div>
